@width-resize-handle: @component-padding / 2;
@color-highlight-handle: lighten(@base-background-color, 20%);
@dock-border-color: @base-border-color;

// Title of the dock
atom-dock .tab-bar.inset-panel .tab .title {
  text-transform: uppercase;
  font-size: @font-size-small;
  font-weight: bold;
}

atom-dock .tab-bar.inset-panel .tab {
  box-shadow: inset 0 -1px 0 0 @dock-border-color;

  &.active {
    background: @base-background-color;
  }
}

.atom-dock-resize-handle {
  position: absolute;
  z-index: 100;

  &.bottom {
    height: @width-resize-handle;
    width: 100%;
    box-shadow: inset 0 1px 0 @dock-border-color;
  }

  &.left,
  &.right {
    width: @width-resize-handle;
    height: 100%;
  }

  &.left {
    box-shadow: inset -1px 0 0 0 @dock-border-color;
  }

  &.right {
    box-shadow: inset 1px 0 0 0 @dock-border-color;
  }
} // .atom-dock-resize-handle

.atom-dock-toggle-button .atom-dock-toggle-button-inner {
  border-radius: @component-border-radius;

  &.left {
    border-left: none;

    .icon {
      transform: translateX(12px);
    }
  }

  &.right {
    border-right: none;

    .icon {
      transform: translateX(-12px);
    }
  }

  &.bottom {
    border-bottom: none;

    .icon {
      transform: translateY(-12px);
    }
  }
} // .atom-dock-toggle-button .atom-dock-toggle-button-inner
